// NOTE - S.G. - 2021-04-01 - The positioning properties (flex/sizes) of the "columns"
// should be kept in sync with ContentListItem.styl
// Or a better solution (flex-grid?) be implemented.
.favoritesHeader
  display flex
  width 100%
  min-height 65px
  justify-content space-between
  align-items center
  & > *
    margin-inline-end standardSpacing
  &__type
    width 75px
    text-align center
  &__title
    flex 2
    text-align start
  &__title-max-sm
    flex 2
    display none
    text-align start
  &__modification
    flex 1
    text-align start
  &__information
    flex 1
    text-align start
  &__favoriteButton
    text-align center
    width 75px

.unavailableContent
  &__name_warning
    display flex
    flex-direction column
  &__warning
    font-size metadataFontSize

.favorites
  &__item
    &__favoriteButton
      font-size titleFontSize
      text-align center
      width 75px
    &__link
      // NOTE S.G. - 2021-03-31 - Leave space for the favorite button
      // 75px == favorite button column width
      width calc(100% - 75px)

@media (max-width: max-lg)
  .favoritesHeader
    &__type
      width 50px
  .favorites
    &__item__link
      // NOTE S.G. - 2021-03-31 - Leave space for the favorite button
      // 50px == favorite button column width
      width calc(100% - 50px)

@media (max-width: max-md)
  .favoritesHeader
    &__information
      display none

@media (max-width: max-sm)
  .favoritesHeader
    &__modification
      display none
    &__title
      display none
    &__title-max-sm
      display unset
